import React, { PureComponent, Fragment } from 'react';
import { Row, Col } from 'antd';
import BuybackOrder from './buybackOrder.less';

const colorMap = {
  0: '#4AB1E2',
  1: '#56678A',
  2: '#E73689',
  3: '#9BA3A7',
  4: '#4AB1E2',
  5: '#56678A',
  6: '#E73689',
  7: '#9BA3A7',
};

const typeMap = {
  0: '可买数量',
  1: '现金余额',
  2: 'T+0可用',
  3: 'T+1可用',
  4: '冻结金额',
  5: '解冻金额',
  6: '当前数量',
  7: '可用数量',
};

export default class PositionCard extends PureComponent {
  render() {
    const { index, data } = this.props;
    return (
      <div className={BuybackOrder.positionInfoCard} style={{ background: colorMap[index] }}>
        <div className={BuybackOrder.positionFont}>{typeMap[index]}</div>
        <div className={BuybackOrder.positionBigFont}>{data[index] || 0}</div>
      </div>
    );
  }
}
